---
id: babel
title: babel
---
在这里只是简单介绍一下babel在webpack中的使用，更多可以去看一下，这里[go](https://www.jiangruitao.com/babe/)
Babel 是一个 JavaScript 编译器，主要用于将采用 ECMAScript 2015+ 语法编写的代码转换为向后兼容的 JavaScript 语法，以便能够运行在当前和旧版本的浏览器或其他环境中。

下面列出的是 Babel 能为你做的事情：

- 语法转换
- 通过 Polyfill 方式在目标环境中添加缺失的特性 （通过引入第三方 polyfill 模块，例如 core-js）
- 源码转换（codemods）

## 安装

` npm install -D babel-loader@4 @babel/core@7 @babel/preset-env`

## 配置

```js
{
    test: /\.js$/,
    exclude: /(node_modules|bower_components)/,
    use: {
        loader: 'babel-loader',
        options: {
            presets: ['@babel/preset-env'],
            targets: {
                "chrome": "58",
                "ie": "6"
            }
        }
    }
},
```

## 配置解释

### @babel/core  babel的主程序（核心程序）
### @babel/preset-env 提供了ES6+转换ES5的语法转换规则
### babel-loader 是在webpack中使用babel的入口集成

- 配置中的 presets 是一些常用（es6 -> es5, es7 -> es5……）的集合 



